import React from 'react';
import Footer from '@/components/footer'
import { SettingO, OrdersO, GoldCoinO, InfoO, Close } from '@react-vant/icons'
const BusinessIndex = () => {
    let navigate = React.router.useNavigate();
    const [LoginUser, setLoginUser] = React.useState(React.$cookie.load('LoginUser') ?? {})
    const [list, setList] = React.useState([])
    const [catetotal, setCatetotal] = React.useState([0])
    const [prototal, setPrototal] = React.useState([0])
    const [leasetotal, setLeasetotal] = React.useState([0])
    const logout = () => {
        React.$vant.Dialog.confirm({
            title: '确认是否退出登陆？',
            onConfirm: () => {
                React.$cookie.remove('LoginUser')
                navigate('/business/login')
            },
        }).catch(err => { });
    }
    React.useEffect(() => {
        getCollectData()
    }, [])

    const getCollectData = async () => {
        let result = await React.$api.collect({
            busid: LoginUser.id
        })
        if (result && result.code == 1) {
            setList(result.data)
            setCatetotal(result.data.catetotal)
            setPrototal(result.data.prototal)
            setLeasetotal(result.data.leasetotal)
        }
    }
    return (
        <>
            <div className="my_kuang">
                <div className="bj_img">
                    <img className="beij_s" src="/assets/images/my_beij.jpg" alt="" />
                    <div className="nimetou_gaib">
                        <div className="toux_hou">
                            <img id="Dfgrg" style={{ height: '1.1rem' }} src={LoginUser.avatar} alt="" />
                            <input id="tupian_Sc" type="file" />
                        </div>
                        <div className="mingz">
                            <h2>{LoginUser.nickname}</h2>
                        </div>
                    </div>
                </div>
                <div className="div_bx_k">
                    <div className="neir_Ef">
                        <div className="yverjif">
                            <ul>
                                <li><h2>{catetotal}</h2><p>收藏文章</p ></li>
                                <li> <h2>{prototal}</h2><p>收藏商品</p ></li>
                                <li><h2>{leasetotal}</h2><p>订单数量</p ></li>
                            </ul>
                        </div>
                        <div className="list_index_my">
                            <div className="fenh_ziyek">
                                <h3>更多服务 </h3>
                            </div>
                            <React.router.NavLink to="/business/profile" >
                                <React.$vant.Cell title='基本资料' icon={<SettingO color='#ffc0cb' style={{ fontSize: '2em' }} />} isLink />
                            </React.router.NavLink>

                            <React.router.NavLink to="/product/leaseindex" >
                                <React.$vant.Cell title='我的订单' icon={<OrdersO color='#ffc0cb' style={{ fontSize: '2em' }} />} isLink />
                            </React.router.NavLink>

                            <React.router.NavLink to="/business/consume" >
                                <React.$vant.Cell title='消费记录' icon={<GoldCoinO color='#ffc0cb' style={{ fontSize: '2em' }} />} isLink />
                            </React.router.NavLink>

                            <React.router.NavLink to="/business/about" >
                                <React.$vant.Cell title='关于我们' icon={<InfoO color='#ffc0cb' style={{ fontSize: '2em' }} />} isLink />
                            </React.router.NavLink>

                            <React.$vant.Cell title='退出登陆' icon={<Close color='#ffc0cb' style={{ fontSize: '2em' }} />} isLink onClick={logout} />
                        </div>
                        <div style={{ height: '.9rem' }}></div>
                    </div>

                </div>
            </div >
            <div style={{ height: '.75rem' }}></div>
            <Footer />
        </>
    )
}

export default BusinessIndex;